<template>
  <div class="hsx-oganizational-structure">
    <Vmask
      :maskTitle="maskTitle"
      :maskData="maskData"
      :showMask="showMask"
      :maskWidth="maskWidth"
      @FnMask="FnMask"
    ></Vmask>
    <h3 class="lh40">组织架构</h3>
    <div class="hsx-oganizational-structure-content bgc-fff">
      <div class="hsx-oganizational-structure-content-left fl">
        <div class="hsx-oganizational-structure-content-left-operation">
          <span @click="FnOperation({type:'add'})">
            <i class="el-icon-circle-plus"></i>
          </span>
          <span @click="FnOperation({type:'edit'})">
            <i class="el-icon-edit"></i>
          </span>
          <span @click="FnOperation({type:'delete'})">
            <i class="el-icon-delete"></i>
          </span>
          <!-- <span @click="FnOperation({type:'upper'})">
            <i class="el-icon-top"></i>
          </span>
          <span @click="FnOperation({type:'lower'})">
            <i class="el-icon-bottom"></i>
          </span>-->
        </div>
        <div class="hsx-oganizational-structure-content-left-table show-table">
          <!-- @current-change="handleCurrentChange" -->
          <el-table
            :data="allOrganizationsData"
            style="width: 100%;margin-bottom: 20px;"
            border
            default-expand-all
            highlight-current-row
            row-key="regionId"
            @row-click="organizationalStructureClickRow"
            :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
          >
            <el-table-column prop="regionId" label="ID"></el-table-column>
            <el-table-column prop="regionName" label="组织架构" width="80"></el-table-column>
            <el-table-column prop="regionCode" label="部门编号" width="80"></el-table-column>
          </el-table>
        </div>
      </div>
      <div class="hsx-oganizational-structure-content-right" v-if="selectOrganizationalStructureId">
        <div class="hsx-oganizational-structure-content-search">
          <div class="row clearfix lh40">
            <!-- <div class="row-item clearfix fl mr15">
              <span class="row-item-title fl">部门名称：</span>
              <span class="fl span-input">
                <el-input placeholder="请输入内容" v-model="getPermissionsDetailsDate"></el-input>
              </span>
            </div>-->
            <div class="row-item clearfix fl mr15 mb15">
              <span class="row-item-title fl">账号：</span>
              <span class="fl span-input">
                <el-input placeholder="请输入内容" v-model.trim="userName"></el-input>
              </span>
            </div>
            <div class="row-item clearfix fl mr15 mb15">
              <span class="row-item-title fl">姓名：</span>
              <span class="fl span-input">
                <el-input placeholder="请输入内容" v-model.trim="realName"></el-input>
              </span>
            </div>
            <div class="row-item clearfix fl mr15 mb15">
              <span class="row-item-title fl">手机号码：</span>
              <span class="fl span-input">
                <el-input placeholder="请输入内容" v-model.trim="mobile"></el-input>
              </span>
            </div>
          </div>
          <div class="clearfix">
            <div class="row-item mb15">
              <el-button type="primary" @click="FnSearch">搜索</el-button>
              <el-button @click="FnEmpty">清空</el-button>
            </div>
          </div>
        </div>
        <div class="hsx-oganizational-structure-content-table">
          <div class="hsx-table-top clearfix tc default-color lh40">
            <div class="hsx-table-operation fl">
              <span @click="FnTableOperation({type:'add'})">新增</span>
              <span @click="FnTableOperation({type:'edit'})">编辑</span>
              <span @click="FnTableOperation({type:'delete'})">删除</span>
              <span @click="FnTableOperation({type:'prohibit'})">禁用</span>
              <span @click="FnTableOperation({type:'enable'})">启用</span>
              <span @click="FnTableOperation({type:'offline'})">强制下线</span>
              <span @click="FnTableOperation({type:'disableLogin'})">禁用登录</span>
              <span @click="FnTableOperation({type:'enableLogin'})">启用登陆</span>
            </div>
            <div class="hsx-table-excle fr">
              <span @click="FnTableOperation({type:'excle'})">导出excle</span>
            </div>
          </div>
          <div class="hsx-table-content">
            <ShowTable
              :tableData="tableData"
              :selections="selections"
              :lableList="lableList"
              :talLength="talLength"
              :pageSize="pageSize"
              :pageNum="pageNum"
              @getSortableFn="getSortableFn"
            ></ShowTable>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Vmask from "../components/v-mask/v-mask";
import ShowTable from "../components/table/show-table";
import {
  EditManagerUser,
  AddManagerUser,
  GetRoleList,
  WorkJobList,
  GetOrganizationInformation,
  EditInstitution,
  LoginStatus,
  OutLogin,
  ManagerUserStop,
  GetAllOrganizations,
  Code,
  AddInstitution,
  GetAddInstitution,
  DeleteOrganization,
  GetManagerUserList,
  DeletManagerUser,
  ManagerUserListExcel
} from "@/axios/api";
export default {
  name: "",
  data() {
    return {
      workJobIdList: [],
      hierarchyList: [],
      selectOrganizationalStructureObj: {}, //组织架构行点击保存的数据
      selectRow: {},
      selectTableId: "", //选中右边的表的id
      mobile: "",
      userName: "", //账号
      realName: "", //姓名
      default: {
        isWatchRegionList: [
          { label: "是", value: 1 },
          { label: "否", value: 0 }
        ], //督办
        isTransferRegionList: [
          { label: "是", value: 1 },
          { label: "否", value: 0 }
        ], //转派
        isAcceptRegionList: [
          { label: "是", value: 1 },
          { label: "否", value: 0 }
        ] //是否为承办部门
      },
      selectOrganizationalStructureId: "", //选择组织架构的id
      maskTitle: "",
      maskData: {},
      showMask: false,
      maskWidth: "0px",
      tableData: [
        // {
        //   id: "1",
        //   n1: "12",
        //   n2: "3",
        //   n3: "33333",
        //   n4: "444",
        //   n5: "555",
        //   n6: "6666",
        //   n7: "7777",
        //   n8: "8",
        //   n9: "否"
        // }
      ],
      selections: false,
      lableList: {
        id: "ID",
        n1: "姓名",
        n2: "账号",
        n3: "手机号码",
        n4: "角色",
        n5: "岗位",
        n6: "所属行政区",
        n7: "所属部门",
        n8: "是否禁用"
      },
      talLength: 0,
      pageSize: 15,
      pageNum: 1,
      getPermissionsDetailsDate: "",
      allOrganizationsData: [
      ],
      defaultData: {
        //新增 编辑 是否的默认数据
        isStopList: [{ label: "是", value: 1 }, { label: "否", value: 0 }],
        enableWorkList: [{ label: "是", value: 1 }, { label: "否", value: 0 }], //排班 enableWork
        isTransferList: [{ label: "是", value: 1 }, { label: "否", value: 0 }], //是否默认转派员：
        isAcceptList: [{ label: "是", value: 1 }, { label: "否", value: 0 }], //是否默认承办员：
        isAcceptManagerList: [
          { label: "是", value: 1 },
          { label: "否", value: 0 }
        ], //是否默认承办员主管：
        isSupportList: [{ label: "是", value: 1 }, { label: "否", value: 0 }], //是否在线：
        isCallList: [{ label: "是", value: 1 }, { label: "否", value: 0 }] //是否话务：
      }
    };
  },
  props: [],
  created() {
    this.FnWorkJobList(); //岗位列表
    this.FnGetAllOrganizations(); //获取组织架构 部门编号列表
  },
  mounted() {},
  methods: {
    FnWorkJobList() {
      //岗位列表
      WorkJobList().then(res => {
        if (res.code == Code) {
          this.workJobIdList = [];
          var list = res.obj.slice();
          for (var i = 0; i < list.length; i++) {
            this.workJobIdList.push({
              value: list[i].workJobId,
              label: list[i].workJobName
            });
          }
        }
      });
    },
    FnGetOrganizationInformation(e) {
      //获取组织架构信息
      GetOrganizationInformation({
        regionId: e
      }).then(res => {
        // console.log(res,'编辑前的数据')
        if (res.code == Code) {
          this.maskTitle = "编辑";
          this.showMask = true;
          this.maskWidth = "550px";
          var { obj } = res;
          this.maskData = {
            organizationalStructureBox: true,
            defaultBox: true,
            editOrganization: true,
            regionCode: obj.regionCode, //部门编码：
            sort: obj.sort, //排序编码：
            isWatchRegion: obj.isWatchRegion, //
            isWatchRegionList: this.default.isWatchRegionList, //是否督办部门：
            isTransferRegion: obj.isTransferRegion, //是否转派部门
            isTransferRegionList: this.default.isTransferRegionList, //是否转派部门
            isAcceptRegion: obj.isAcceptRegion, //是否承办部门：
            isAcceptRegionList: this.default.isAcceptRegionList, //是否承办部门：
            regionNameList: this.regionNameList, //行政
            pRegionId: obj.pRegionId,
            pRegionIdText: this.FnReturnText(
              this.regionNameList,
              obj.pRegionId,
              'pRegionIdText'
            ),
            regionName: obj.regionName, //部门名称-输入
            regionId: this.selectOrganizationalStructureObj.regionId
          };
        }
      });
    },
    FnReturnText(l,id,text) {//根据传入的id，来显示匹配的文本
      var list = l.slice();
      var arr = []
      var that = this;
      if(!list.length) {
        return {}
      }
      for(var i=0;i<list.length;i++) {
        if(list[i].regionId==id) {
          var label = list[i].regionName;
          that[text] = {
            label,
            value:list[i].regionId
          }
          return
        }else if(list[i].children&&list[i].children.length>0) {
          for(var j=0;j<list[i].children.length;j++) {
             arr.push((list[i].children)[j])
          }
          if(i==(list.length-1)) {
            that.FnReturnText(arr,id,text)
          }
        }
      } 
    },
    FnSearch() {
      this.pageNum = 1;
      this.selectTableId = "";
      this.FnGetManagerUserList();
    },
    FnEmpty() {
      this.mobile = this.realName = this.userName = "";
    },
    FnAddInstitution(e) {
      //新增提交
      var pRegionId = "";
      if (e.pRegionId.length > 0) {
        var l = e.pRegionId.length;
        pRegionId = e.pRegionId[l - 1];
      }
      if(e.regionName===''||e.sort===''||e.isAcceptRegion===''||e.isTransferRegion===''||e.isWatchRegion===''||e.regionCode===''||e.pRegionId==='') {
        this.$message.error("参数不能为空")
        return
      }
      AddInstitution({
        pRegionId, //上级地市Id
        regionName:e.regionName, //部门名称
        regionCode: e.regionCode, //地市编号
        isWatchRegion: e.isWatchRegion, //是否为督办部门
        isTransferRegion: e.isTransferRegion, //是否为转办部门
        isAcceptRegion: e.isAcceptRegion, //是否为承办部门
        sort: e.sort //排序
      }).then(res => {
        if (res.code == Code) {
          // console.log(res)
          this.$message.success("新增成功");
          this.showMask = false;
          this.maskData = {};
          this.FnGetAllOrganizations();
        }
      });
    },
    FnGetAddInstitution() {
      //新增机构参数
      GetAddInstitution({}).then(res => {
        console.log(res);
      });
    },
    FnGetAllOrganizations() {
      //获取组织架构 部门编号列表
      GetAllOrganizations({}).then(res => {
        if (res.code == Code) {
          // console.log(res,'获取组织架构 部门编号列表')
          var list = [];
          list[0] = {
              pregionId: res.obj.pregionId,
              regionName: res.obj.regionName,
              regionCode: res.obj.regionCode,
              regionId: res.obj.regionId,
              children: res.obj.children?res.obj.children.slice():[]
          }
        this.allOrganizationsData = list.slice()
        this.regionNameList = list.slice()
        this.topRegionNameList = list.slice()
        }
      });
    },
    FnGetRoleList() {
      //获取角色列表
      GetRoleList({
        pageIndex: this.maskPageNum,
        pageSize: 5
      }).then(res => {
        if (res.code == Code) {
          // console.log(res,'获取角色列表')
          this.maskData.total = res.obj.total;
          var list = res.obj.records.slice();
          this.maskData.tableData = [];
          for (var i = 0; i < list.length; i++) {
            this.maskData.tableData.push({
              id: list[i].roleId,
              name: list[i].roleName
            });
          }
        }
      });
    },
    FnEditManagerUser(e) {
      //编辑前获取数据
      this.maskPageNum = 1;
      EditManagerUser({
        userId: e
      }).then(res => {
        // console.log(res,'编辑前获取数据')
        var { obj } = res;
        (this.maskWidth = "600px"), (this.maskTitle = "编辑人员");
        this.showMask = true;
        var roles = [];
        var eRoleName = res.obj.roles ? res.obj.roles.slice() : [];
        eRoleName.forEach(v => {
          roles.push({ roleName: v.roleName, roleId: v.roleId });
        });
        this.FnReturnText(this.regionNameList,obj.regionId,'showRegionNameText');
        this.FnReturnText(this.regionNameList,obj.topRegionId,'showTopRegionNameText');
        this.maskData = {
          defaultBox: true,
          userId: obj.userId, //用户id
          personnelManagementBox: true, //人员管理弹框
          editStaff: true, //编辑人员
          realName: obj.realName, //姓名
          mobile: obj.mobile, //电话
          password: obj.password,
          userName: obj.userName, //账号名称
          workJobId: obj.workJobId, //岗位
          workJobIdList: this.workJobIdList,
          roles, //选中的id数组
          roleNameList: [],
          topRegionName: [], //所属行政区
          showTopRegionNameText: this.showTopRegionNameText?this.showTopRegionNameText:{}, //所属行政区--展示 this.showTopRegionNameText
          topRegionNameList: this.topRegionNameList,
          regionName: "", //部门
          showRegionNameText: this.showRegionNameText?this.showRegionNameText:{}, //返回部门,//部门文本展示 this.showRegionNameText
          regionNameList: this.regionNameList, ////所属行政区一样
          isCall: obj.isCall, //是否话务员：
          isCallList: this.defaultData.isCallList, //是否话务员：
          extNumber: obj.extNumber, //绑定分机
          extPass: obj.extPass, //分机密码
          isStop: obj.isStop,
          isStopList: this.defaultData.isStopList,
          enableWork: obj.enableWork,
          enableWorkList: this.defaultData.enableWorkList,
          isTransfer: obj.isTransfer, //
          isTransferList: this.defaultData.isTransferList, //是否默认转派员：
          isAcceptManager: obj.isAcceptManager, //
          isAcceptManagerList: this.defaultData.isAcceptManagerList, //是否默认承办员：
          isAccept: obj.isAccept,
          isAcceptList: this.defaultData.isAcceptList, //是否默认承办员：
          isSupport: obj.isSupport,
          isSupportList: this.defaultData.isSupportList, //是否在线客服：
          tableData: this.FnGetRoleList()
        };
      });
    },
    FnTableOperation(e) {
      //右边table的操作按钮
      if (e.type == "add") {
        //新增
        (this.maskWidth = "600px"), (this.maskTitle = "新增人员");
        this.showMask = true;
        this.maskPageNum = 1;
        this.maskData = {
          showRegionNameText: {},
          showTopRegionNameText: {},
          realName: "", //姓名
          mobile: "", //电话
          password: "",
          userName: "", //账号名称
          workJobId: "", //岗位
          workJobIdList: this.workJobIdList,
          roleName: [], //角色名称--显示
          roles: [], //选中的id数组
          roleNameList: [],
          topRegionName: [], //所属行政区
          topRegionNameList: this.topRegionNameList,
          regionName: [],
          regionNameList: this.regionNameList, ////所属行政区一样
          isCall: "", //是否话务员：
          isCallList: this.defaultData.isCallList, //是否话务员：
          extNumber: "", //绑定分机
          extPass: "", //分机密码
          isStop: "",
          isStopList: this.defaultData.isStopList,
          enableWork: "",
          enableWorkList: this.defaultData.enableWorkList,
          isTransfer: "", //
          isTransferList: this.defaultData.isTransferList, //是否默认转派员：
          isAcceptManager: "", //
          isAcceptManagerList: this.defaultData.isAcceptManagerList, //是否默认承办员：
          isAccept: "",
          isAcceptList: this.defaultData.isAcceptList, //是否默认承办员：
          isSupport: "",
          isSupportList: this.defaultData.isSupportList, //是否在线客服：
          tableData: this.FnGetRoleList(),
          defaultBox: true,
          personnelManagementBox: true, //人员管理弹框
          addStaff: true //新增人员
        };
      } else if (e.type == "edit") {
        if (this.selectTableId == "") {
          this.$message.error("请先选择一列进行操作");
          return;
        }
        //编辑
        // this.maskTitle = "编辑人员";
        // this.showMask = true;
        // this.maskWidth = "600px";
        // this.maskData = {
        //   personnelManagementBox: true,
        //   defaultBox: true,
        //   tableEdit:true
        // };
        this.FnEditManagerUser(this.selectTableId); //编辑前获取数据
      } else if (e.type == "delete") {
        if (this.selectTableId == "") {
          this.$message.error("请先选择一列进行操作");
          return;
        }
        //删除
        this.maskTitle = "删除提示";
        this.showMask = true;
        this.maskWidth = "400px";
        this.maskData = {
          defaultTitle: "请问是否XXX删除？",
          defaultTitleBox: true,
          trueOrFalse: true,
          userId: this.selectTableId,
          deleteUser: true
        };
      } else if (e.type == "prohibit") {
        if (this.selectTableId == "") {
          this.$message.error("请先选择一列进行操作");
          return;
        }
        //禁用
        this.maskTitle = "禁用提示";
        this.showMask = true;
        this.maskWidth = "400px";
        this.maskData = {
          defaultTitle: "请问是否禁用？",
          defaultTitleBox: true,
          trueOrFalse: true,
          stopFlag: 1,
          userId: this.selectTableId
        };
      } else if (e.type == "enable") {
        if (this.selectTableId == "") {
          this.$message.error("请先选择一列进行操作");
          return;
        }
        //启用
        this.maskTitle = "启用提示";
        this.showMask = true;
        this.maskWidth = "400px";
        this.maskData = {
          defaultTitle: "请问是否启用？",
          defaultTitleBox: true,
          trueOrFalse: true,
          stopFlag: 0,
          userId: this.selectTableId
        };
      } else if (e.type == "offline") {
        if (this.selectTableId == "") {
          this.$message.error("请先选择一列进行操作");
          return;
        }
        //强制下线
        this.maskTitle = "强制下线提示";
        this.showMask = true;
        this.maskWidth = "400px";
        this.maskData = {
          defaultTitle: "请问是否强制下线？",
          defaultTitleBox: true,
          trueOrFalse: true,
          username: this.selectRow.userName,
          usernameBox: true
        };
      } else if (e.type == "disableLogin") {
        if (this.selectTableId == "") {
          this.$message.error("请先选择一列进行操作");
          return;
        }
        //禁用登录
        this.maskTitle = "禁用登录提示";
        this.showMask = true;
        this.maskWidth = "400px";
        this.maskData = {
          defaultTitle: "请问是否禁用登录？",
          defaultTitleBox: true,
          trueOrFalse: true,
          userId: this.selectTableId,
          loginFlag: -1
        };
      } else if (e.type == "enableLogin") {
        if (this.selectTableId == "") {
          this.$message.error("请先选择一列进行操作");
          return;
        }
        //启用登陆
        this.maskTitle = "启用登陆提示";
        this.showMask = true;
        this.maskWidth = "400px";
        this.maskData = {
          defaultTitle: "请问是否启用登陆？",
          defaultTitleBox: true,
          trueOrFalse: true,
          userId: this.selectTableId,
          loginFlag: 1
        };
      } else if (e.type == "excle") {
        //导出excle
        this.FnExcle();
      }
    },
    FnEditOrganization(e) {
      //左边-组织编辑
      var pRegionId = "";
      if (e.pRegionId == "" || e.pRegionId.length == 0) {
        this.$message.error("上级不能为空");
        return;
      } else if (typeof e.pRegionId == "object" && e.pRegionId.length) {
        var l = e.pRegionId.length;
        pRegionId = e.pRegionId[l - 1];
      } else if (e.pRegionId || e.pRegionId.length) {
        pRegionId = e.pRegionId;
      }
      if(e.regionName===''||e.sort===''||e.isAcceptRegion===''||e.isTransferRegion===''||e.isWatchRegion===''||e.regionCode===''||pRegionId==='') {
        this.$message.error("参数不能为空")
        return
      }
      AddInstitution({
        _method: "patch",
        regionId: e.regionId, //修改的组织id
        regionName: e.regionName, //部门
        regionCode: e.regionCode, //部门编码
        isWatchRegion: e.isWatchRegion, //是否为督办部门
        isTransferRegion: e.isTransferRegion, //是否为转办部门
        isAcceptRegion: e.isAcceptRegion, //是否为承办部门
        pRegionId, //父地市Id
        sort: e.sort //排序
      }).then(res => {
        if (res.code == Code) {
          this.$message.success("修改成功");
          this.FnGetAllOrganizations(); //获取组织架构 部门编号列表
          this.showMask = false;
          this.maskData = {};
        }
      });
    },
    FnModifyManagerUser(e) {
      //编辑人员--确定修改
      var roles = []; //角色
      var regionId = ""; //部门
      var topRegionId = ""; //所属行政区
      var rolesList = e.roles.slice();
      // console.log(e,'/编辑人员--确定修改')
      rolesList.forEach(v => {
        roles.push(v.roleId);
      });
      if(e.mobile===''||e.realName===''||e.password===''||e.userName===''||e.workJobId===''||e.isCall===''||e.extPass===''||e.isTransfer===''||e.isAccept===''||e.isSupport===''||e.isAcceptManager===''||e.isStop===''||e.extNumber===''||e.enableWork==='') {//
        this.$message.error("参数不能为空")
        return
      }
      if (e.showRegionNameText && e.showRegionNameText.value) {
        //部门
        regionId = e.showRegionNameText.value;
      } else if (e.regionName && e.regionName.length) {
        var regionNameLength = e.regionName.length;
        regionId = e.regionName[regionNameLength - 1];
      } else {
        // console.log(regionId,'regionId')
        this.$message.error("部门不能为空");
        return;
      }
      if (e.showTopRegionNameText && e.showTopRegionNameText.value) {
        //所属行政区
        topRegionId = e.showTopRegionNameText.value;
      } else if (e.topRegionName && e.topRegionName.length) {
        var topRegionNameLength = e.topRegionName.length;
        topRegionId = e.topRegionName[topRegionNameLength - 1];
      } else {
        this.$message.error("所属行政区不能为空");
      }
      EditInstitution({
        userId: e.userId, //用户id
        _method: "patch",
        mobile: e.mobile,
        realName: e.realName, //姓名
        password: this.$md5(e.password), //密码
        userName: e.userName, //账号
        workJobId: e.workJobId, //岗位
        regionId, //部门
        topRegionId, //所属行政区
        isCall: e.isCall, //是否话务员
        isStop: e.isStop, //是否禁用：
        // isStop: e.isStop, //是否禁用：
        extNumber: e.extNumber, //绑定分机
        enableWork: e.enableWork, //加入排班：
        extPass: e.extPass, //分机密码：
        isTransfer: e.isTransfer, //是否默认转派员：
        isAccept: e.isAccept, //是否默认承办员：
        isAcceptManager: e.isAcceptManager, //是否是承办主管
        isSupport: e.isSupport, //是否在线客服：
        roles: JSON.stringify(roles) //角色
      }).then(res => {
        if (res.code == Code) {
          // console.log(res)
          this.$message.success("修改成功");
          this.showMask = false;
          this.maskData = {};
          this.FnSearch();
          this.FnGetManagerUserList(); //人员管理列表
        }
      });
    },
    FnMask(e) {
      //弹框事件
      console.log(e,'弹框事件')
      if (e.type == "false") {
        this.showMask = false;
        this.maskData = {};
      } else if (e.type == "true") {
        if (e.content.addOrganizationalStructure == true) {
          //左边-组织新增
          this.FnAddInstitution(e.content);
        } else if (e.content.editOrganization == true) {
          //左边-组织编辑
          this.FnEditOrganization(e.content);
        } else if (e.content.delete == true) {
          //删除组织
          this.FnDeleteOrganization(e.content.pregionId);
        } else if (e.content.deleteUser == true) {
          //删除人员
          this.FnDeletManagerUser(e.content.userId);
        } else if (e.content.stopFlag == 1) {
          //禁用
          this.FnManagerUserStop(e.content.userId, 1);
        } else if (e.content.stopFlag == 0) {
          //启用
          this.FnManagerUserStop(e.content.userId, 0);
        } else if (e.content.usernameBox == true) {
          //强制下线
          this.FnOutLogin(e.content.username);
        } else if (e.content.loginFlag == -1) {
          //禁用 用户登录
          this.FnLoginStatus(e.content.userId, -1);
        } else if (e.content.loginFlag == 1) {
          //启用 用户登录
          this.FnLoginStatus(e.content.userId, 1);
        } else if (e.content.tableEdit == true) {
          //右边表的编辑
          // this.FnEditInstitution(e.content)
        } else if (e.content.addStaff == true) {
          //人员管理弹框--新增
          this.FnAddManagerUser(e.content);
        } else if (e.content.editStaff == true) {
          //人员管理弹框--编辑人员
          this.FnModifyManagerUser(e.content);
        }
      } else if (e.type == "pageNum") {
        //页数改变
        this.maskPageNum = e.content;
        this.FnGetRoleList();
      } else if (e.type == "clickRow") {
        //单击行
        var isHave = true;
        for (var i = 0; i < this.maskData.roles.length; i++) {
          if (e.content.id == this.maskData.roles[i].roleId) {
            isHave = false;
            this.maskData.roles.splice(i,1)
          }
        }
        if (isHave) {
          this.maskData.roles.push({
            roleId: e.content.id,
            roleName: e.content.name
          }); //选中的角色id
          // this.maskData.roleName.push(e.content.name)//选中的角色名字
        }
        // this.maskData.roleName = e.content.name
        // this.maskData.roleId = e.content.id;//选中的角色id
      }
    },
    FnAddManagerUser(e) {
      //添加人员 新增人员
      var topRegionId = "";
      var regionId = "";
      var roles = []; //角色
      var rolesList = e.roles.slice();
      rolesList.forEach(v => {
        roles.push(v.roleId);
      });
      if(e.mobile===''||e.realName===''||e.password===''||e.userName===''||e.workJobId===''||e.isCall===''||e.extPass===''||e.isTransfer===''||e.isAccept===''||e.isSupport===''||e.isAcceptManager===''||e.isStop===''||e.extNumber===''||e.enableWork==='') {
        this.$message.error("参数不能为空")
        return
      }
      if (!roles.length) {
        this.$message.error("角色不能为空");
        return;
      }
      if (e.topRegionName && e.topRegionName.length) {
        var topRegionNameLength = e.topRegionName.length;
        topRegionId = e.topRegionName[topRegionNameLength - 1];
      } else {
        this.$message.error("行政区域不能为空");
        return;
      }
      if (e.regionName && e.regionName.length) {
        var regionNameLength = e.regionName.length;
        regionId = e.regionName[regionNameLength - 1];
      } else {
        this.$message.error("部门不能为空");
        return;
      }
      // console.log(e,'新增参数');
      AddManagerUser({
        mobile: e.mobile, //电话
        workJobId: e.workJobId, //岗位
        userName: e.userName, //账号名称
        password: this.$md5(e.password), //密码
        regionId, //部门
        topRegionId, //行政
        realName: e.realName, //姓名
        roles: JSON.stringify(roles), //角色id
        isCall: e.isCall, //是否为话务员
        enableWork: e.enableWork, //是否加入排班(0:否 1:是)
        isAccept: e.isAccept, //是否是承办员
        isAcceptManager: e.isAcceptManager, //是否是承办主管
        isSupport: e.isSupport, //是否是客服人员
        isStop: e.isStop, //用户停用标志，1：停用；0：未停用 默认为未停用
        extNumber: e.extNumber, //分机号码
        extPass:e.extPass, //分机密码
        isTransfer: e.isTransfer //默认转派
      }).then(res => {
        // console.log("添加返回结果")
        if (res.code == Code) {
          this.showMask = false;
          this.maskData = {};
          this.$message.success("新增成功");
          this.FnGetManagerUserList(); //人员管理列表
        }
      });
    },
    FnLoginStatus(e, v) {
      //禁用 启用登录
      LoginStatus({
        userId: e,
        loginFlag: v
      }).then(res => {
        if (res.code == Code) {
          if (v == 1) {
            this.$message.success("启用登录成功");
          } else {
            this.$message.success("禁用登录成功");
          }
          this.showMask = false;
          this.maskData = {};
          this.pageNum = 1;
          this.FnGetManagerUserList();
          this.selectTableId = "";
        }
      });
    },
    FnOutLogin(e) {
      OutLogin({
        username: e,
        off:1
      }).then(res => {
        if (res.code == Code) {
          this.$message.success("强制下线成功");
          this.showMask = false;
          this.maskData = {};
          this.pageNum = 1;
          this.FnGetManagerUserList();
          this.selectTableId = "";
        }
      });
    },
    FnManagerUserStop(e, v) {
      //禁用 启用
      ManagerUserStop({
        userId: e,
        stopFlag: v
      }).then(res => {
        if (res.code == Code) {
          if (v == 1) {
            this.$message.success("禁用成功");
          } else {
            this.$message.success("启用成功");
          }
          this.showMask = false;
          this.maskData = {};
          this.pageNum = 1;
          this.FnGetManagerUserList();
          this.selectTableId = "";
        }
      });
    },
    FnDeletManagerUser(e) {
      //删除人员
      DeletManagerUser({
        userId: e,
        _method: "delete"
      }).then(res => {
        if (res.code == Code) {
          this.$message.success("删除成功");
          this.showMask = false;
          this.maskData = {};
          this.pageNum = 1;
          this.FnGetManagerUserList();
          this.selectTableId = "";
        }
      });
    },
    FnEditInstitution(e) {
      EditInstitution({}).then(res => {
        if (res.code == Code) {
          this.$message.success("修改成功");
          this.FnGetAllOrganizations(); //获取组织架构 部门编号列表
        }
      });
    },
    FnDeleteOrganization(e) {
      //删除机构
      AddInstitution({
        regionId: e,
        _method: "delete"
      }).then(res => {
        // console.log(res)
        if (res.code == Code) {
          this.$message.error("删除成功");
          this.FnGetAllOrganizations();
          this.showMask = false;
          this.maskData = {};
        }
      });
    },
    FnGetAllOrganizationsList() {
      //所属行政管理 列表
      GetAllOrganizations({}).then(res => {
        if (res.code == Code) {
          // console.log(res,'所属行政管理111')
          this.topRegionNameList = []; //所属行政管理
          this.regionNameList = []; //部门
          // var newAllOrganizationsData = [];
          // topRegionNameList = [
          // {
          //     value: 'zhinan',
          //     label: '指南',
          //     children: [{
          //       id: 'shejiyuanze',
          //       label: '设计原则',
          //       children: [{
          //         value: 'yizhi',
          //         label: '一致'
          //       }]
          //     }, {
          //       value: 'daohang',
          //       label: '导航',
          //       children: [{
          //         value: 'cexiangdaohang',
          //         label: '侧向导航'
          //       }]
          //     }]
          //   }
          // ];
          var list = res.obj.children.slice();
          this.topRegionNameList = [
            {
              value: res.obj.regionId,
              label: res.obj.regionName,
              children: []
            }
          ];
          this.regionNameList = [
            {
              value: res.obj.regionId,
              label: res.obj.regionName,
              children: []
            }
          ];
          for (var i = 0; i < list.length; i++) {
            if (!list[i]) {
              continue;
            }
            var obj = {
              value: list[i].regionId,
              label: list[i].regionName,
              children: []
            };
            if (list[i].children && list[i].children.length != 0) {
              var secondaryList = list[i].children.slice();
              for (var j = 0; j < secondaryList.length; j++) {
                var o = {
                  value: secondaryList[j].regionId,
                  label: secondaryList[j].regionName,
                  children: []
                };
                obj.children.push(o);
              }
            }
            this.topRegionNameList[0].children.push(obj);
            this.regionNameList[0].children.push(obj);
          }
          // this.allOrganizationsData = newAllOrganizationsData
        }
      });
    },
    FnOperation(e) {
      //左边组织架构操作按钮
      if (e.type == "add") {
        //新增
        this.maskTitle = "新增";
        // this.FnGetAddInstitution()//新增参数
        this.showMask = true;
        this.maskWidth = "550px";
        this.maskData = {
          regionCode: "", //地市编号
          organizationalStructureBox: true,
          addOrganizationalStructure: true,
          defaultBox: true,
          // regionName:[],
          regionNameList: this.regionNameList, //行政
          pRegionId: [], //上级部门
          isWatchRegionList: this.default.isWatchRegionList, //是否督办
          isWatchRegion: "", //是否督办
          isTransferRegionList: this.default.isTransferRegionList, //转办
          isTransferRegion: "", //转办
          isAcceptRegion: "", //是否为承办部门
          isAcceptRegionList: this.default.isAcceptRegionList, //是否为承办部门
          sort: ""
        };
      } else if (e.type == "edit") {
        //编辑
        if (!this.selectOrganizationalStructureId) {
          this.$message.error("请先选择组织架构");
          return;
        }
        this.FnGetOrganizationInformation(
          this.selectOrganizationalStructureObj.regionId
        ); //获取组织架构信息
      } else if (e.type == "delete") {
        //删除
        if (!this.selectOrganizationalStructureId) {
          this.$message.error("请先选择组织架构");
          return;
        }

        this.maskTitle = "删除提示";
        this.showMask = true;
        this.maskWidth = "400px";
        this.maskData = {
          defaultTitle: "请问是否删除",
          defaultTitleBox: true,
          trueOrFalse: true,
          pregionId: this.selectOrganizationalStructureId,
          delete: true
        };
      } else if (e.type == "upper") {
        //上 排序
      } else if (e.type == "lower") {
        //下 排序
      }
    },
    getSortableFn(e) {
      //表发生的
      // console.log(e, "表发生的");
      if (e.type == "selectionRow") {
        this.selectTableId = e.content.row.userId;
        this.selectRow.userName = e.content.row.userName;
      }else if (e.type == "pageSize") {
        this.pageSize = e.content;
        this.FnGetManagerUserListPaging()
      }else if (e.type == "pageNum") {
        this.pageNum = e.content;
        this.FnGetManagerUserListPaging()
      }
    },
    organizationalStructureClickRow(e) {
      //组织架构行点击
      this.selectOrganizationalStructureId = e.regionId;
      this.selectOrganizationalStructureObj = e;
    },
    handleCurrentChange(e, b) {
      console.log(e, "e");
      console.log(b, "b");
    },
    FnGetManagerUserListPaging() {//用户列表-分页
      GetManagerUserList({
        regionId: this.lastData.regionId,
        mobile: this.lastData.mobile,
        userName: this.lastData.userName, //账号
        realName: this.lastData.realName, //姓名
        pageSize: this.pageSize,
        pageIndex: this.pageNum
      }).then(res => {
        if (res.code == Code) {
          // console.log(res)
          this.talLength = res.obj.total;
          this.tableData = [];
          var list = res.obj.records.slice();
          for (var i = 0; i < list.length; i++) {
            this.tableData.push({
              id: list[i].userId, //"ID",
              n1: list[i].realName, // "姓名",
              n2: list[i].userName, // "账号",
              n3: list[i].mobile, // "手机号码",
              n4: list[i].roleNames, //"角色",
              n5: list[i].workJobName, //"岗位",
              n6: list[i].topRegionName, // "所属行政区",
              n7: list[i].regionName, // "所属部门",
              n8: list[i].isStop ? "是" : "否", // "是否禁用"
              row: list[i]
            });
          }
        }
      });
    },
    FnGetManagerUserList() {//用户列表
      this.lastData = {
        regionId: this.selectOrganizationalStructureId,
        mobile: this.mobile,
        userName: this.userName, //账号
        realName: this.realName, //姓名
      }
      this.FnGetManagerUserListPaging()
    },
    FnExcle() {
      var that = this;
      window.location.href = `${this.$prefix}/manager/user/list/excel/?regionId=${that.selectOrganizationalStructureId}&mobile=${that.mobile}&userName=${that.userName}&realName=${that.realName}&pageSize=${that.pageSize}&pageIndex=${that.pageNum}`;
    }
  },
  components: {
    ShowTable,
    Vmask
  },
  computed: {},
  watch: {
    selectOrganizationalStructureId: {
      handler(n, o) {
        if (n != "") {
          this.FnGetManagerUserList();//用户列表
        }
      },
      deep: true
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang='scss' scoped>
.hsx-oganizational-structure {
  min-width: 950px;
  .hsx-oganizational-structure-content {
    overflow: hidden;
  }
  .hsx-oganizational-structure-content-left {
    width: 300px;
    .hsx-oganizational-structure-content-left-operation {
      display: flex;
      span {
        background-color: #fff;
        line-height: 40px;
        height: 40px;
        text-align: center;
        flex: 1;
        cursor: pointer;
        display: inline-block;
        &:hover {
          i {
            color: #409eff;
          }
        }
        i {
          font-size: 15px;
        }
      }
    }
  }
  .hsx-oganizational-structure-content-right {
    min-width: 650px;
    padding-top: 15px;
    overflow: auto;
    padding-left: 15px;
    .hsx-oganizational-structure-content-search {
      .row {
        margin-bottom: 10px;
        .row-item {
          span {
            width: 120px;
          }
          .row-item-title {
            width: 65px;
            text-align: right;
          }
        }
      }
    }
    .hsx-oganizational-structure-content-table {
      .hsx-table-top {
        span {
          display: inline-block;
          width: 65px;
          cursor: pointer;
        }
      }
    }
  }
}
</style>
